<template>
    <header>
        <van-nav-bar title="商品" left-text="返回" right-text="按钮" left-arrow @click-Left="onClickLeft"
            @click-right="onClickRight" />
    </header>
    <div class="box">
        <DetailLunbo :banners="banners"></DetailLunbo>
        <detail-msg :pro-list="proMsgLocal"></detail-msg>
    </div>
    <detail-foot></detail-foot>
</template>

<script>
import DetailFoot from './components/DetailFoot.vue';
import DetailLunbo from './components/DetailLunbo.vue';
import DetailMsg from './components/DetailMsg.vue';
import Address from './components/Address.vue';
import { getDetailPro } from '@/apis/home';
export default {
    components: {
        DetailFoot,
        DetailLunbo,
        DetailMsg,
        Address
    },
    data() {
        return {
            banners: [], //图片详情  
            proMsgLocal: [],
        }
    },
    created() {
        //打印接收的数据
        // console.log(this.$route.params.proid);
        getDetailPro(this.$route.params.proid).then(res => {
            this.banners = res.data.data.banners[0].split(',')
            this.proMsgLocal = [res.data.data]
            // console.log(res.data.data);

        })
    },
    methods: {
        onClickRight() {

        },
        onClickLeft() {
            this.$router.go(-1);
        }
    }
}
</script>

<style lang="less" scoped>
header {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
}

.box {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow-y: auto;
}
</style>